<template>
    <input type="text" v-model="name">
    <button @click="click">确定</button>
    <button @click="click2">读取</button>
</template>
<script setup lang="ts">
import { useLocalStorage, throttleFilter } from "@vueuse/core"
import { onUnmounted, ref } from "vue"
// 函数节流：经过指定时间执行一次保存

const name = ref('')

const storage = useLocalStorage("name", '', { eventFilter: throttleFilter(5000) })

function click() {
    storage.value = name.value
}

function click2(){
    console.log(localStorage.getItem('name'))
}

onUnmounted(() => {
    console.log('HtxUseThrottle被卸载')
})

</script>